<template>
	<div class="demand">
		<div class="demand-box">
			<div class="title">-免费发任务需求 吸引人才-</div>
			<div class="small-title">已为2655名雇主找到专业人才</div>
			<select class="demand-xl">
				<option>选择你需要发布的任务需求，如包装设计</option>
				<option>选择你需要发布的任务需求，如包装设计</option>
				<option>选择你需要发布的任务需求，如包装设计</option>
			</select>
			<div class="yzm">
				<input class="demand-phone" type="number" placeholder="请输入手机号码" />
				<div class="yzm-box">
					<input class="sryzm" type="text" placeholder="请输入验证码" />
					<span class="hqyzm">获取验证码</span>
				</div>
			</div>
			<button class="mffb">免费发布任务需求</button>
		</div>
		<img src="../../../assets/imges/sybn.png" class="little-banner" />
	</div>
</template>
<script> 
export default {
	name:'demand'
}	
</script> 
<style>
	.demand{
		padding: .34rem 0 .35rem 0;
		background-color: #fff;
		margin-top: .2rem;
	}
	.demand-box{
		padding: 0 .3rem;
	}
	.title{
		font-size: .3rem;
		font-weight: 600;
		text-align: center;
	}
	.small-title{
		text-align: center;
		font-size: .24rem;
		color: #cacaca;
		padding-top: .14rem;
	}
	.demand-xl{
		height: .75rem;
		line-height: .75rem;
		background: #f2f2f2;
		border-radius:.1rem;
		width: 100%;
		margin-top: .24rem;
		font-size: .24rem;
		color: #4d4d4d;
	}
	.yzm{
		display: flex;
		margin-top: .2rem;
	}
	.demand-phone{
		height: .6rem;
		width: 37%;
		background-color: #f2f2f2;
		font-size: .24rem;
		line-height: .6rem;
		padding: 0 .2rem;
		border-radius:.1rem;
	}
	.yzm-box{
		height: .6rem;
		width: 61%;
		background-color: #f2f2f2;
		font-size: .2rem;
		border-radius:.1rem;
		margin-left: 2%;
	}
	.sryzm{
		width: 1.63rem;
		height: .25rem;
		line-height: .25rem;
		background-color: #f2f2f2;
		border-right:.01rem solid #cdcdcd;
		margin-top: .19rem;
		padding-left:.2rem;
	}
	.hqyzm{
		display: block;
		margin-top: .2rem; 
		float: right;
		margin-right: .2rem;
		color: #ff9800;
		font-size: .24rem;
	}
	.mffb{
		height: .66rem;
		line-height: .66rem;
		border: 0;
		color: #fff;
		text-align: center;
		font-size: .28rem;
		background: #ff9800;
		width: 100%;
		border-radius:.1rem ;
		margin-top: .2rem;
	}
	.little-banner{
		display: block;
		margin-top: .25rem;
		height: 1.5rem;
		width: 100%;
	}
</style>